import React, { Component } from "react";
import { View, FlatList } from "react-native";
import { request, getUserName } from "../../utils";
import CustomHeader from "../../components/CustomHeader";
import { ListItem } from "react-native-elements";

export class PersonGuardian extends Component {
  constructor(props) {
    super(props);
    this.state = {
      pId: props.navigation.getParam("pId", 0),
      pName: props.navigation.getParam("pName"),
      guardianList: []
    };
  }
  componentDidMount() {
    const { pId } = this.state;
    request("person/guardianList", { pId }, guardianList =>
      this.setState({ guardianList })
    );
  }

  render() {
    const { pName, guardianList } = this.state;
    return (
      <View>
        <CustomHeader title={pName + "-监护人"} />
        <FlatList
          data={guardianList}
          renderItem={({ item }) => {
            return (
              <ListItem
                leftAvatar={{ source: { uri: item.Avatar } }}
                title={getUserName(item)}
                bottomDivider
              />
            );
          }}
        />
      </View>
    );
  }
}

export default PersonGuardian;
